﻿@model ZBJF.Warranty.Model.InsuranceWarrantyRecordInfoCollect
<script src="/Scripts/WarrantyRecord/warrantyRecord.js"></script>

<form class="form-horizontal" enctype="multipart/form-data" id="mvcForm" method="post" name="mvcForm" novalidate="novalidate">
    @Html.HiddenFor(m => m.ID)
    @Html.HiddenFor(m => m.InsuranceWarrantyRecordID)
    @Html.HiddenFor(m => m.InfoCollectWith)
    @Html.HiddenFor(m => m.InfoColectItemID)
    @Html.HiddenFor(m => m.InfoColectItemName)
    @Html.HiddenFor(m => m.NeedUploadPicCount)
    <div class="upload-file-contain">
        <ul id="img">
            <li id="img1">
                <div id="uploadDiv">
                    <span name="ImageType" multiple="multiple"><i class="icon-plus"></i></span>
                </div>
                <input type="file" id="inputfile" onchange="fileChange(this)" style="display: none" />
            </li>
        </ul>
    </div>
    <div class="margin-10 align-center">
        <input class="btn btn-primary" type="button" onclick="infoCollectSubmit()" value="上传" />
        <input class="btn" onclick="parent.layer.closeAll();" type="button" value="关闭" />
    </div>
</form>
<script>

    function fileChange(e) {
        var f = e.files[0];
        if (f.size > 2048 * 1024) {
            alert("超过最大图片限制(2M)");
            return;
        }
        var fr = new FileReader();
        fr.readAsDataURL(f);
        fr.onload = function (f) {
            compressImg(this.result, 500, function (data) {
                var html = "<li style='position:relative;'><img class='product-img' src='" + data + "'>";
                html += "<input type='hidden' name='InsuranceWarrantyRecordInfoCollect' value='" + data + "'/>";
                html += "<i class='product-img-remove icon-remove' onclick='DdRemove(this)'></i></li>";
                $("#img1").before(html);
                Binding();
            });
        };
    }
    var Binding = function () {
        $("#img li[id='img1']").siblings("li").mouseover(function () {
            $(this).children("img").next().show();
            event.stopPropagation();
        }).mouseout(function () {
            $(this).children("img").next().hide();
            event.stopPropagation();
        });
    }
    function DdRemove(obj) {
        $(obj).parent().remove();
    }

    $(function () {
        Binding();
        $("#uploadDiv").on("click", function () {
            var imglenght = $("#img li").length;
            if (imglenght < 10) { //最多允许上传9张
                $("#inputfile").trigger("click");
            } else {
                layer.msg("最多上传九张");
                $("#inputfile").unbind("click");
            }
        });
    });
    function infoCollectSubmit(parameters) {
        if ($("#img li").length < 2) {
            layer.alert("请选择要上传的图片！");
            return false;
        }
        var form = document.getElementById('mvcForm');
        var formData = new FormData(form);

        layer.load();//弹出遮罩层

        $.ajax({
            url: "/WorkOrderCommonInfo/SaveInfoCollect",
            type: "post",
            data: formData,
            processData: false,
            contentType: false,
            success: function (data) {
                layer.alert("保存成功！", {
                    closeBtn: 0,
                    yes: function () {
                        parent.$("#divInfoCollectItems_" + $("#InfoCollectWith").val()).html(data);
                        parent.layer.closeAll();
                    }
                }
                );
            }
        });
        return true;
    }
</script>
